react-native 真机调试（android）
adb devices (查看链接的设备id)adb -s 897879（设备号） reverse tcp:8081 tcp:8081 （当设备断开重新链接）当只有一个设备时上面的命令可以简写成adb reverse tcp:8081 tcp:8081 ...
2024-01-10
react-native练手（android版）
1.环境搭建1）一步步按 https://reactnative.cn/docs/getting-started.html 操作2）brew install watchman3）https://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html 下载并安装 jdk 8，javac -version 看安装成功与否4）https://developer.android.com/studio/index.h...
2024-01-10
mac react-native从零开始android真机测试
1. 安装android相关jdk，(https://blog.csdn.net/vvv_110/article/details/72897142)2. 手机和mac使用usb连接， 手机开发者设置中打开use调试设置， 保证手机和电脑在统一wifi下。3. 在终端进入到react-native目录下执行 react-native run-android4. 然后该命令会开启一个服务，该程序首先会自动找 ~ ./gradle文件，如果有需要的gradle...
2024-01-10
React Native for Android 学习笔记
C:\Users\Vic Lee\AwesomeProject>react-native run-androidStarting JS server...Running D:\Android\sdk/platform-tools/adb reverse tcp:8081 tcp:8081error: closedCould not run adb reverse: Command failed: D:\Android\sdk/platform-tools/adb reverse tcp:8081 tcp:8...
2024-01-10
Window 7 下android react native 新建环境
本博客基于win7 64位系统android出现的步骤及错误情况记录详情参考react native 中文网：http://reactnative.cn/docs/0.48/getting-started.html#content需要下载东西：Node（4.4.4以上版本最好，最新的最优）gitandroid sdkjdk 1.8Android studioGenymotion具体步骤请参考以上的react native 中文网下边仅介绍android过程中遇到的坑1.Gen...
2024-01-10
React Native02-开始运行 Android篇
1. 开始运行1）用命令进入到新建的文件目录下，比如HelloWorld，再输入 react-native start：在等待一段时间后，我们看到最后面有个地址，说明已经运行成功了。我们输入地址 http://localhost:8081/index.android.bundle?platform=android，可以看到有一大堆的js：到此，我们成功运行。 2. 运行android平台 1）我们...
2024-01-10
React Native for Android 异常处理概览
AndroidReact Native本文的RN代码基于0.43版本准备接入React Native(RN)时，看看前辈们分享的经验，都说刚接入时崩溃率是一个问题。最近在做RN的Native部分优化，今天就来聊聊在RN中的异常都是什么，该怎么处理。前言首先，研究RN框架异常的动机在于，我们需要建立起一套针对性的容错机制，毕竟它还...
2024-01-10
React 动画 Animation
文章源自: https://facebook.github.io/react/docs/animation.htmlReactCSSTransitionGroup 基于 ReactTransitionGroup ,当一个React组件enter或者leave时可以方便的用来执行CSS transitions和animations。导入ReactCSSTransitionGroupimport ReactCSSTransitionGroup from 'react-addons-css-transition-...
2024-01-10
react native 之三 reactJSX基础
1. ReactJS 和 React Native 比较2.reactJSX书写借鉴于XHTML的一些规范 (1)开始和结束标签配对 <组件>ooxx</组件> (2)无内容的组件标签应写为自封闭标签 <组件/> (3)可自定义属性,字符串值应使用双引号,其他值用{}括起来 <Person age = {23} sex = "male" married = {tr...
2024-01-10
react项目npm run dev报错;
项目启动报错，各种百度也没找到是什么问题，而且也没有报是什么原因造成的，希望大佬们指点一下，在线急。const render = (Component) => {ReactDOM.render(<Provider store={store}><AppContainer><BrowserRouter basename='/'><Route path={`/`} component={App}></Route></BrowserRouter></AppContainer></Provider>,document...
2024-01-10
React Native之支付集成(微信 支付宝)(ios android)
一,需求分析 1.1,app在线充值与提现 二,技术介绍与集成 2.1,微信支付 2.1.1,Android配置详细配置可查看React Native之微信分享(iOS Android),这里主要介绍的是支付方面的配置第一步:创建名为'wxapi'的文件夹，并在文件夹内创建WXPayEntryActivity.java，用于获得微信的授权和支付权限。 1 package your.packag...
2024-01-10
react native 如何mock自己编写的native module？
在编写RN时使用到了原生模块，在npm test进行测试的时候遇到了问题。网上谷歌了一遍发现需要mock自己编写的native module，但是现在遇到了以下问题：现在mock 原生模块使用以下方式describe('MypageApi', () => { beforeEach(() => { NativeModules.MyPageApiFunction = { getMyPageInfo: () => { myPageInfo =...
2024-01-10
react-native上手之环境搭建及连接模拟器 - Diamond_xx
react-native上手之环境搭建及连接模拟器 使用react-native创建应用app，环境搭建很重要。我使用的是夜神模拟器进行模拟。环境搭建1.安装java jdk （1）官网下载java jdk安装包，傻瓜式安装，下一步 下一步 （2）配置环境变量修改环境变量，新增JAVA_HOME的系统环境变量，...
2024-01-10
angular vue react 启动命令
vue: npm install vue-cli -g vue init webpack my-project npm install npm run devangular: npm install -g typescript npm install -g @angular/cli ng new my-project npm install npm start (ng serve)react: npm install -g create-react-app create-react-app react-p...
2024-01-10
使用react-native-tab-navigator切换页面
切换页面是app最基本功能。这个功能需要用Navigation组件实现。RN发展太快了(v49)，之前自带的Navigation组件被弃用了，如果只针对ios，还可以用NavigatorIOS社区中也有几个不错的https://github.com/react-community/react-navigationhttps://github.com/wix/react-native-navigationhttps://github.com/happypancake/react-native-tab-navi...
2024-01-10
React-native 自定义actionsheet 即拿即用
不管是写程序还是生活 要经常总结啊= =要不然真的会忘啊今天经验值+++++， 待提升空间太大了。===========================js文件============================import React from 'react';import PropTypes from 'prop-types';import {View,StyleSheet,Text,Modal,TouchableOpacity,Dimensions} from 'react-native'cons...
2024-01-10
react-native textArea 高度不变化问题
ref={el =>{ if(el){ el.textareaRef.style.height = el.textareaRef.scrollHeight + 'px'; } } } ...
2024-01-10
react+antd-mobile之TabBar路由
想了解create-react-app配置antd-mobile按需加载，以及配置less和vw的可以看上一篇博客这一篇特别记录antd-mobile的TabBar配合路由的使用按照antd-mobile给出的文档，可以构建出此UI页面（相信都能做到）目前的这个是没有加路由的，我想要的是，点击我的，地址栏的URL可以改成http://localhost:3000/my，在网上看...
2024-01-10
React Native react-navigation 导航使用详解
一、开源库介绍今年1月份，新开源的react-natvigation库备受瞩目。在短短不到3个月的时间，github上星数已达4000+。Fb推荐使用库，并且在React Native当前最新版本0.44中将Navigator删除。react-navigation据称有原生般的性能体验效果。可能会成为未来React Native导航组件的主流军。本篇内容基于【 ^1.0.0-beta.9 】版本...
2024-01-10![[RN] React Native 使用 阿里 ant-design](/wp-content/uploads/thumbs/534683_thumbnail.jpg)
[RN] React Native 使用 阿里 ant-design
React Native 使用 阿里 ant-design 实例效果如图：一、安装npm install antd-mobile-rn --savenpm install babel-plugin-import --save-dev二、配置编辑根目录下 .babelrc 增加 红色区域显示代码{ "presets": [ "module:metro-react-native-babel-preset" ], "plugins": [ [ "import", { ...
2024-01-10
React Native在Android平台运行gif的解决方法转载
概述目前RN在Android平台上不支持gif格式的图片，而在iOS平台是支持的，期待以后的版本中系统也是可以默认支持Android的。首先说下在ios平台怎么加载gif呢？ <Image source= {require(\'./img/loading.gif\')} style = {styles.loading}/> 11完整实例：xport default class Loading extends React.Component { render(){ if (!th...
2024-01-10
React Native 适配Android物理返回键，实现连续两次点击退出
一直使用iPhone作为测试机开发,提交给测试同事Android版本后发现很多适配问题,其中一个非常明显的是,弹出一个modal后,点击Android的返回键,modal不会消失,直接navigation goBack了在Android端需要处理物理按键事件 , 另外可以实现连续两次点击退出APP的功能 componentDidMount(): void { //挂载完,添加返回按键的监...
2024-01-10
（二）react-native开发系列之windows开发环境配置
之前写了react-native在mac上得环境搭建，但是如果只开发android的话，只要用windows系统就可以了，下面就来说下react-native的windows开发环境配置。1、下载配置jdk下载jdk1.8，下载之后安装jdk并配置环境变量，网上有很多教程，这里就不写了2、下载配置sdk之前有写过sdk的下载与安装，不熟悉的话可以看下：...
2024-01-10
React Native踩坑之路 — 运行Android项目的各种坑坑(Windows)
之前我们已经初始化了一个Raect Native 项目，验证了Android环境的正确性，接下来就运行起来吧！运行命令： ① react-native start ② react-native run-android运行步骤：1. 执行①命令react-native start后是这样的效果（如下图） 2. 第一步命令完成后，我们要先启动模拟器或者连上手机才可以...
2024-01-10
react native开发错误及解决方法（更新ing...）
1.unable to load script from assets 'index.android.bundle'.Make sure your bundle ispackged correctly or you are running a packger server.操作步骤：1）.在项目文件夹\android\app\src\main新建assets文件夹；2）.在根目录cmd下运行：react-native bundle --platform android --dev false --entry...
2024-01-10
